import 'package:flutter/material.dart';
import 'package:flutter_slidable/flutter_slidable.dart';
import 'package:flutter_widget/custom/custom_appbar.dart';
import 'package:flutter_widget/utils/slidable.dart';

// ignore: must_be_immutable
class SlidAble extends StatefulWidget {
  String name;
  SlidAble({Key? key, required this.name}) : super(key: key);
  @override
  _SlidAbleState createState() => _SlidAbleState();
}

class _SlidAbleState extends State<SlidAble> {
  final List<Map> slidAbleList = SlidAbleUtils.slidAbleList;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: CustomAppbar(widget.name, Theme.of(context).primaryColor),
      body: ListView.builder(
        itemCount: slidAbleList.length,
        itemBuilder: (context, index) {
          final List<Map> startActionPane =
              slidAbleList[index]['startActionPane'];
          final List<Map> endActionPane = slidAbleList[index]['endActionPane'];
          return Slidable(
            key: ValueKey(index),
            // ignore: prefer_const_literals_to_create_immutables
            startActionPane: ActionPane(
              motion: const ScrollMotion(),
              dismissible: DismissiblePane(onDismissed: () {
                // 删除
                setState(() {
                  slidAbleList.removeAt(index);
                });
              }),
              children: startActionPane
                  .map(
                    (Map e) => SlidableAction(
                      onPressed: (BuildContext context) =>
                          openShowDialog(e, index),
                      backgroundColor: e['backgroundColor'],
                      foregroundColor: e['foregroundColor'],
                      icon: e['icon'],
                      label: e['label'],
                    ),
                  )
                  .toList(),
            ),
            endActionPane: ActionPane(
              motion: const ScrollMotion(),
              children: endActionPane
                  .map(
                    (e) => SlidableAction(
                      onPressed: (BuildContext context) =>
                          openShowDialog(e, index),
                      backgroundColor: e['backgroundColor'],
                      foregroundColor: e['foregroundColor'],
                      icon: e['icon'],
                      label: e['label'],
                      flex: e['flex'],
                    ),
                  )
                  .toList(),
            ),
            child: Container(
              color: Colors.white,
              child: ListTile(
                  leading: CircleAvatar(
                    backgroundColor: Theme.of(context).primaryColor,
                    child: Text(index.toString()),
                    foregroundColor: Colors.white,
                  ),
                  title: Text(slidAbleList[index]['title']),
                  subtitle: Text(slidAbleList[index]['subtitle']),
                  trailing: const Icon(Icons.keyboard_arrow_right)),
            ),
          );
        },
      ),
    );
  }

  void openShowDialog(Map e, int index) async {
    final String label = e['label'];
    e["index"] = index;
    final res = await showDialog(
      context: context,
      builder: (BuildContext context) {
        return AlertDialog(
          title: Text(label),
          content: Text('确定$label嘛'),
          actions: [
            // ignore: deprecated_member_use
            ElevatedButton(
              onPressed: () {
                e["buttonText"] = "确定";
                Navigator.pop(
                  context,
                  e,
                );
              },
              child: const Text(
                "确定",
                style: TextStyle(
                  fontSize: 20,
                  color: Colors.white,
                ),
              ),
            ),
            // ignore: deprecated_member_use
            ElevatedButton(
              onPressed: () {
                e["buttonText"] = "取消";
                Navigator.pop(
                  context,
                  e,
                );
              },
              child: const Text(
                "取消",
                style: TextStyle(
                  fontSize: 20,
                  color: Colors.white,
                ),
              ),
            ),
          ],
        );
      },
    );
    // ignore: avoid_print
    print(res?['label']);
    // ignore: avoid_print
    print(res?['buttonText']);
  }
}
